<template>
  <a-modal title="历史版本信息" :visible.sync="visible" @cancel="cancel" :footer="null"  width="900px">
    <a-table :columns="columns" :data-source="dataList"  :pagination="false" :loading="loading">
        <span slot="index" slot-scope="text, record, index">
            {{index+1}}
        </span>
        <span slot="versionNumber" slot-scope="text,record">
           V{{text}}
        </span>
      <span slot="action" slot-scope="text, record, index">
        <a type="text" @click="detailed(record, index)"> 查看详情 </a>
      </span>
    </a-table>
  </a-modal>
</template>
<script>
  import {queryHistory} from '@/api/technical/optimizationPlan'
  const columns = [
    { title: '序号', width: 65, scopedSlots: { customRender: 'index' } },
    { title: '版本号', dataIndex: 'currentVersion',scopedSlots: { customRender: 'versionNumber' }},
    { title: '状态', dataIndex: 'status'},
    { title: '版本创建时间', dataIndex: 'createTime' },
    { title: '创建人', dataIndex: 'filledBy' },
    { title: '操作', scopedSlots: { customRender: 'action' } }
  ]
  const statusList = [
    {
      key: '待提交',
      value: 'DRAFT'
    },
    {
      key: '审核中',
      value: 'SUBMITTED'
    },
    {
      key: '审核通过',
      value: 'PAST'
    },
    {
      key: '审核不通过',
      value: 'REJECTED'
    }
  ]
  export default {
    props: {
      // 显隐控件
      visible: {
        type: Boolean,
        default() {
          return false
        }
      },
      versionId:{
        type:String,
        default(){
          return ''
        }
      },
      row: {
        type: Object,
        default() {
          return {}
        }
      }
    },
    data() {
      return {
        dataList: [],
        loading: false,
        columns
      }
    },
    watch: {
      visible: {
        immediate: true,
        handler(val) {
          if (val) {
            this.loading = true
            this.getProgramHistoryListFn();
          }
        }
      },
    },
    methods: {
      cancel() {
        this.$emit('cancel',false)
      },
      getProgramHistoryListFn(){
        this.dataList = []
        queryHistory(this.versionId).then((res)=>{
          this.loading = false
          res.data.forEach(item=>{
           const obj =  statusList.find(ele=> ele.value === item.status)
            item.status = obj.key
          })
          this.dataList = res.data || [];
        })
      },
      //查看历史数据详情
      detailed(record, index) {
        let query = {
          type: 'view',
          id: record.id,
        }
        if(index != 0 ) {
          query.version = true
        }
        this.$router.push({
          path: '/technical/planDetailed',
          query
        })
        this.$emit('cancel',false)
      },
    }
  }
</script>